jsonp应用

- 1、jsonp应用场景

跨域调用服务，适用于跨域get请求，返回jsfunction(“{key:key}”)格式的json数据，页面解析时会直接调用jsfunction方法，解析结果数据

- 2、jsonp的工作原理

就是利用 script标签没有跨域限制的“漏洞”来达到与第三方通讯的目的。 第三方产生的响应为json数据的包装（故称之为jsonp，即json padding），形如： callback({“name”:”hax”,”gender”:”Male”}) 这样浏览器会调用callback函数，并传递解析后json对象作为参数。

ajax

jsonp参数对应callbackParam参数名，jsonpCallback对应值，也就是回调的页面js function方法名。

（注意：如果回调不成功，检查返回的数据是不是json。）

先回调jsonpCallback方法（如果没有直接跳过这一步），再进入ajax success的处理逻辑。

jsonp仅仅适用于跨服务的get请求

后台返回数据格式为：

“callbackParam”({“view”:null,”model”:{“hashMap”:{“result”:”{\”items\”:[{\”item\”:\”1\”,\”score\”:0.8},{\”item\”:\”2\”,\”score\”:0.6},{\”item\”:\”3\”,\”score\”:0.9},{\”item\”:\”5\”,\”score\”:0.6},{\”item\”:\”6\”,\”score\”:0.1}]}”,”message”:”Success”,”Flag”:”1”}},”empty”:false,”viewName”:null,”reference”:false,”modelMap”:{“hashMap”:{“result”:”{\”items\”:[{\”item\”:\”1\”,\”score\”:0.8},{\”item\”:\”2\”,\”score\”:0.6},{\”item\”:\”3\”,\”score\”:0.9},{\”item\”:\”5\”,\”score\”:0.6},{\”item\”:\”6\”,\”score\”:0.1}]}”,”message”:”Success”,”Flag”:”1”}}})

spring4.0,返回JSONObject，返回的格式为
{
“function”:”callbackParam”,
“value”:{“view”:null,”model”:{“hashMap”:{“result”:”{\”items\”:[{\”item\”:\”1\”,\”score\”:0.8},{\”item\”:\”2\”,\”score\”:0.6},{\”item\”:\”3\”,\”score\”:0.9},{\”item\”:\”5\”,\”score\”:0.6},{\”item\”:\”6\”,\”score\”:0.1}]}”,”message”:”Success”,”Flag”:”1”}},”empty”:false,”viewName”:null,”reference”:false,”modelMap”:{“hashMap”:{“result”:”{\”items\”:[{\”item\”:\”1\”,\”score\”:0.8},{\”item\”:\”2\”,\”score\”:0.6},{\”item\”:\”3\”,\”score\”:0.9},{\”item\”:\”5\”,\”score\”:0.6},{\”item\”:\”6\”,\”score\”:0.1}]}”,”message”:”Success”,”Flag”:”1”}}}
}

- 3、页面js

$.ajax({
    type: "GET",
    async:false,
    url :"http://localhost:8180/autoRecommend/getuserproductinfo?"+timestamp,
    data: {userId:1,id:1,type:"cid_number"},
    dataType : "jsonp",
    jsonp: "callbackParam",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
    // jsonpCallback:"callback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名,
    success : function(data){
        alert(JSON.stringify(data.model.hashMap));
        var resultMessage = data.model.hashMap.message;
        if(resultMessage == 'Success') {
            var jsonpData = data.model.hashMap.result;
            var dataJson = eval("(" + jsonpData + ")");
            $("#recommend").html("");
            var count = 1;
            $.each(dataJson,function(i,v){ 
             console.log(JSON.toJSONString(v));
             }); 
        }
    },
    error:function(data){
    }
});

- 4、后台

import org.codehaus.jackson.map.util.JSONPObject;

/**
* "callbackParam"为参数名
* callbackParam的值为页面回调的js function名
*/
@RequestMapping(value = "/getuserproductinfo", method = RequestMethod.GET,produces = "text/html")    
public @ResponseBody JSONPObject getUserProductInfo(HttpServletRequest request, @RequestParam String callbackParam) throws Exception {
    curr_logger.debug("===================getUserProductInfo start===================");
    ModelAndView modelAndView = new ModelAndView();
    Map<String, Object> map = new HashMap<String, Object>();
    String result = "";
    try {
        String userId=request.getParameter("userId");
        result=productRecommendBiz.getUserProductInfo(userId);
    } catch (Exception e) {
        map = putInfoToMap(HealthContent.NO_FOUND_FLAG, "No Found ProductInfo");
        map.put("result", "");
        modelAndView.addObject(map);
        return new JSONPObject(callbackParam,modelAndView);//spring3.x 4.x都支持
//            return callbackParam+"("+ JSON.toJSONString(modelAndView)+")";//只支持spring4.x
    }

}